Cara PWA, WebAssembly, dan ChromeOS membantu editor video berbasis web memberikan performa yang lebih baik dan pengalaman yang lebih menarik kepada 12 juta pengguna.
97%
Pertumbuhan bulanan dalam penginstalan PWA
2,3x
Peningkatan performa
9%
Retensi yang lebih tinggi di pengguna PWA
Clipchamp adalah editor video online dalam browser yang memungkinkan siapa saja untuk menceritakan kisah yang layak dibagikan melalui video. Di seluruh dunia, lebih dari 12 juta kreator menggunakan Clipchamp untuk mengedit video dengan mudah. Kami menawarkan solusi sederhana untuk membuat video, mulai dari alat intuitif seperti pemangkasan dan pemotongan, hingga fitur praktis seperti perekam layar, dan bahkan pembuat meme.
Siapa yang menggunakan Clipchamp?
Pengguna kami (atau editor sehari-hari seperti yang kami sebut) sangat beragam. Anda tidak perlu memiliki keahlian khusus untuk menjadi editor video dengan Clipchamp. Secara khusus, saat ini kami melihat tim penjualan, pelatihan dukungan, dan pemasaran produk menggunakan webcam dan perekam layar untuk konten penjelasan singkat dengan teks dan GIF tambahan agar konten tersebut menarik. Kami juga mengamati banyak bisnis kecil yang mengedit dan memposting video media sosial saat bepergian.
Tantangan apa yang mereka hadapi?
Kami memahami bahwa pengeditan video mungkin terasa menakutkan pada awalnya. Asumsinya adalah hal itu sulit, mungkin karena pengalaman sebelumnya yang membuat frustrasi dengan software pengeditan yang rumit. Sebaliknya, Clipchamp berfokus pada kemudahan dan kesederhanaan, memberikan dukungan dengan overlay teks, video dan musik stok, template, dan lainnya.
Kami mendapati bahwa sebagian besar editor sehari-hari tidak ingin membuat karya film yang luar biasa. Kami sering berbicara dengan pengguna dan terus diingatkan bahwa mereka sibuk dan hanya ingin menyampaikan cerita mereka kepada dunia secepat dan semudah mungkin, jadi ini adalah fokus kami.
Mengembangkan PWA Clipchamp
Di Clipchamp, kami ingin memberdayakan orang untuk menceritakan kisah mereka melalui video. Untuk memenuhi visi ini, kami segera menyadari bahwa mengizinkan pengguna menggunakan rekaman mereka sendiri saat menyusun project video adalah hal yang penting.
Insight tersebut memberikan tekanan pada tim engineer Clipchamp untuk menemukan teknologi yang dapat memproses file media berskala Gigabyte secara efisien di aplikasi web. Dengan mempertimbangkan batasan bandwidth jaringan, kami dengan cepat mengesampingkan solusi berbasis cloud tradisional. Mengupload file media berukuran besar dari koneksi internet retail akan selalu menimbulkan waktu tunggu yang sangat lama sebelum pengeditan dapat dimulai, yang secara efektif menghasilkan pengalaman pengguna yang buruk.
Hal itu membuat kami beralih ke solusi sepenuhnya dalam browser, tempat semua "pekerjaan berat" pemrosesan video dilakukan secara lokal menggunakan resource hardware yang tersedia di perangkat pengguna akhir. Kami secara strategis mengandalkan browser Chrome dan, secara ekstensi, platform ChromeOS untuk membantu kami mengatasi tantangan yang tidak dapat dihindari dalam membuat platform pembuatan video dalam browser.
Pemrosesan video sangat membutuhkan resource, yang memengaruhi resource komputer dan penyimpanan. Kami mulai mem-build Clipchamp versi pertama di atas Native Client (PNaCl) (Portable) Google. Meskipun pada akhirnya dihentikan, PNaCl adalah konfirmasi yang bagus bagi tim kami bahwa aplikasi web dapat memiliki latensi yang cepat dan rendah, sekaligus tetap berjalan di hardware pengguna akhir.
Saat beralih ke WebAssembly, kami senang melihat Chrome mengambil peran utama dalam menggabungkan fitur pasca-MVP seperti operasi memori massal, threading, dan yang terbaru: operasi vektor lebar tetap. Yang terakhir telah sangat diantisipasi oleh tim engineer kami, yang menawarkan kemampuan untuk mengoptimalkan stack pemrosesan video untuk memanfaatkan operasi SIMD, yang umum di CPU kontemporer. Dengan memanfaatkan dukungan SIMD WebAssembly Chrome, kami dapat mempercepat beberapa beban kerja yang sangat berat seperti dekode video 4K dan encoding video.
Dengan sedikit pengalaman sebelumnya dan dalam waktu kurang dari sebulan bagi salah satu engineer kami, kami berhasil meningkatkan performa sebesar 2,3x lipat. Meskipun masih terbatas pada uji coba origin Chrome, kami sudah dapat meluncurkan peningkatan SIMD ini kepada sebagian besar pengguna. Meskipun pengguna kami menjalankan konfigurasi hardware yang sangat berbeda, kami dapat mengonfirmasi peningkatan performa yang cocok dalam produksi tanpa melihat efek merugikan pada rasio kegagalan.
Baru-baru ini, kami mengintegrasikan WebCodecs API yang baru muncul, yang saat ini tersedia dalam uji coba origin Chrome lainnya. Dengan kemampuan baru ini, kami akan dapat meningkatkan performa decoding video lebih lanjut pada hardware dengan spesifikasi rendah seperti yang ditemukan di banyak Chromebook populer.
Setelah PWA dibuat, penting untuk mendorong adopsinya. Seperti banyak aplikasi web, kami berfokus pada kemudahan akses yang mencakup hal-hal seperti login sosial termasuk Google, yang dengan cepat mengarahkan pengguna ke tempat mereka dapat mengedit video, lalu memudahkan ekspor video. Selain itu, kami mempromosikan perintah penginstalan PWA di toolbar dan sebagai notifikasi pop-up di navigasi menu kami.
Hasil
PWA Chrome yang dapat diinstal telah berjalan dengan sangat baik. Kami sangat senang melihat retensi 9% lebih tinggi dengan pengguna PWA dibandingkan dengan pengguna desktop standar kami. Penginstalan PWA sangat besar, meningkat dengan kecepatan 97% per bulan sejak kami meluncurkannya lima bulan lalu. Dan, seperti yang disebutkan sebelumnya, peningkatan SIMD WebAssembly meningkatkan performa 2,3x lipat.
Mendatang
Kami terkejut dengan interaksi dan penggunaan PWA kami. Kami yakin retensi pengguna Clipchamp akan meningkat karena PWA diinstal dan lebih mudah diakses. Kami juga melihat bahwa PWA berperforma lebih baik untuk editor, sehingga lebih menarik dan membuat orang terus kembali.
Ke depannya, kami sangat antusias dengan peluang yang diberikan ChromeOS kepada lebih banyak pengguna untuk menyelesaikan lebih banyak hal dengan lebih mudah. Secara khusus, kami senang dengan beberapa integrasi praktis dengan OS lokal saat menangani file. Menurut kami, hal ini akan membantu mempercepat alur kerja untuk editor kami yang sibuk sehari-hari, dan itu adalah salah satu prioritas tertinggi kami.